<template>
  <div class="app-container ">
    <h3>MM012Oj 采购收货</h3>

    <template v-if="false">
      <el-select v-model="selectedFileType" disabled placeholder="请选择文件类型">
        <el-option
          v-for="fileType in fileTypes"
          :key="fileType.value"
          :label="fileType.label"
          :value="fileType.value"
        />
      </el-select>

      <el-upload
        disabled
        class="upload-demo"
        action="#"
        :show-file-list="false"
        :on-change="handleChange"
      >
        <el-button slot="trigger" disabled size="small" type="primary">点击上传文件</el-button>
      </el-upload>
    </template>

    <el-table
      v-if="data.length > 0"
      :data="data"
      border
      style="width: 100%; margin-top: 20px;"
      size="medium"
    >

      <el-table-column prop="id" label="执行结果" width="50" align="center">
        <template slot-scope="scope">
          <!--          <el-link type="primary">编辑</el-link>-->
          <i class="el-icon-success" style="color: red;" />
        </template>
      </el-table-column>

      <el-table-column prop="id" label="行序号" />
      <el-table-column
        v-for="(column,index) in visibleColumns"
        :key="column.prop"
        :prop="column.prop"
        :label="`${index + 1}. ${column.label}`"
        width="180"
      />
    </el-table>
  </div>
</template>

<script>
import { fetchFileData } from '@/api/basics'

export default {
  name: 'MM0120j',
  props: ['ppath'],
  data() {
    return {
      data: [],
      selectedFileType: '', // Selected file type
      fileTypes: [
        { label: '收货（收货指令）', value: 'receipt' },
        { label: '收货（收货结果）', value: 'receipt_result' }
        // { label: '其他文件类型', value: 'other' }
        // Add more file types as needed
      ]
    }
  },
  computed: {
    visibleColumns() {
      return [
        { prop: 'ReceiptID', label: '收货指令编号' },
        { prop: 'OrgID', label: '收货工厂的客户编号' },
        { prop: 'ShipFrom', label: '发货方的供应商ID' },
        { prop: 'ShipTo', label: '收货方的采购工厂ID' },
        { prop: 'SellerID', label: '卖方的供应商ID' },
        { prop: 'BuyerID', label: '买方的采购工厂ID' },
        { prop: 'ReceiptType', label: '收货类型' },
        { prop: 'ReceiptCode', label: '收货单号' },
        { prop: 'ReceiveDate', label: '收货日期' },
        { prop: 'RelatedTranType', label: '相关交易类型' },
        { prop: 'RefrenceNo', label: '参考编号' },
        { prop: 'Comments', label: '备注' },
        { prop: 'WareHouseID', label: '存储位置ID' },
        { prop: 'ReceiptDetailID', label: '收货指令的详细项编号' },
        { prop: 'ReceiptID1', label: '收货指令编号' },
        { prop: 'ItemID', label: '物料编号' },
        { prop: 'DeliveryDetailID', label: '交货明细ID' },
        { prop: 'OrderID', label: '订单编号' },
        { prop: 'OrderDetailID', label: '订单行项目编号' },
        { prop: 'QtyShipped', label: '发货数量' },
        { prop: 'QtyReceived', label: '收货数量' },
        { prop: 'QtyInspected', label: '检验数量' },
        { prop: 'QtyAccepted', label: '接受数量' },
        { prop: 'QtyInvalid', label: '无效数量' },
        { prop: 'ComplaintReasonCode', label: '投诉原因代码' },
        { prop: 'InvStatus', label: '库存状态' },
        { prop: 'Comments_UoM', label: '计量单位的备注' },
        { prop: 'WarehouseID', label: '存储位置ID' },
        { prop: 'BaseQty', label: '基本数量中的收货数量' },
        { prop: 'MovementType', label: '移动类型' },
        { prop: 'ValuationType', label: '估价类型' },
        { prop: 'InvoiceNumber', label: '发票号码' },
        { prop: 'VendorItemCode', label: '供应商物料代码' }
      ]
    }
  },
  created() {
    this.getfetchFileData()
  },
  methods: {
    async getfetchFileData() {
      const response = await fetchFileData({
        'name': 'MM0120j',
        'path': this.ppath
      })
      this.data = response.data
    },
    handleChange(file, fileList) {
      const reader = new FileReader()
      reader.onload = (event) => {
        const text = event.target.result.replace(/\n$/, '')

        if (this.selectedFileType === 'receipt') {
          this.parseText(text) // Call function to parse text data
        } else if (this.selectedFileType === 'receipt_result') {
          this.parseText1(text) // Call function to parse text data
        }
      }
      reader.readAsText(file.raw)
    },
    parseText1(text) {
      const lines = text.split('\n')
      const parsedData = lines.map((line, index) => {
        const fields = line.split('\t')
        return {
          id: index + 1, // Generate ID based on index (you can adjust as needed)
          ReceiptID: fields[0],
          OrgID: fields[1],
          ShipFrom: fields[2],
          ShipTo: fields[3],
          SellerID: fields[4],
          BuyerID: fields[5],
          ReceiptType: fields[6],
          ReceiptCode: fields[7],
          ReceiveDate: fields[8],
          RelatedTranType: fields[9],
          RefrenceNo: fields[10],
          Comments: fields[11],
          WareHouseID: fields[12],
          ReceiptDetailID: fields[13],
          ReceiptID1: fields[14],
          ItemID: fields[15],
          DeliveryDetailID: fields[16],
          OrderID: fields[17],
          OrderDetailID: fields[18],
          QtyShipped: fields[19],
          QtyReceived: fields[20],
          QtyInspected: fields[21],
          QtyAccepted: fields[22],
          QtyInvalid: fields[23],
          ComplaintReasonCode: fields[24],
          InvStatus: fields[25],
          Comments_UoM: fields[26],
          WarehouseID: fields[27],
          BaseQty: fields[28],
          MovementType: fields[29],
          ValuationType: fields[30]
          // InvoiceNumber: fields[31],
          // VendorItemCode: fields[32]
        }
      })
      this.data = parsedData
    },
    parseText(text) {
      const lines = text.split('\n')
      const parsedData = lines.map((line, index) => {
        const fields = line.split('\t')
        return {
          id: index + 1, // Generate ID based on index (you can adjust as needed)
          ReceiptID: fields[0],
          OrgID: fields[1],
          ShipFrom: fields[2],
          ShipTo: fields[3],
          SellerID: fields[4],
          BuyerID: fields[5],
          ReceiptType: fields[6],
          ReceiptCode: fields[7],
          ReceiveDate: fields[8],
          RelatedTranType: fields[9],
          RefrenceNo: fields[10],
          Comments: fields[11],
          WareHouseID: fields[12],
          ReceiptDetailID: fields[13],
          ReceiptID1: fields[14],
          ItemID: fields[15],
          DeliveryDetailID: fields[16],
          OrderID: fields[17],
          OrderDetailID: fields[18],
          QtyShipped: fields[19],
          QtyReceived: fields[20],
          QtyInspected: fields[21],
          QtyAccepted: fields[22],
          QtyInvalid: fields[23],
          ComplaintReasonCode: fields[24],
          InvStatus: fields[25],
          Comments_UoM: fields[26],
          WarehouseID: fields[27],
          BaseQty: fields[28],
          MovementType: fields[29],
          ValuationType: fields[30],
          InvoiceNumber: fields[31],
          VendorItemCode: fields[32]
        }
      })
      this.data = parsedData
    }
  }
}
</script>

<style scoped>
.upload-demo {
  margin-bottom: 20px;
}
</style>
